<template>
  <div class="user">
    <basic-container>
      <avue-crud
        :option="option"
        ref="crud"
        v-model="form"
        :page="page"
        :simple-page="true"
        @on-load="getList"
        @size-change="sizeChange"
        @current-change="currentChange"
        :table-loading="listLoading"
        @search-change="handleFilter"
        @refresh-change="handleRefreshChange"
        @search-reset="handleRefreshChange"
        :before-open="handleOpenBefore"
        :data="list"
        @row-update="update"
      >
        <template slot="order_no" slot-scope="scope">
          <div class="link" @click="getDomain(scope.row.order_no)">{{scope.row.order_no}}</div>
        </template>
        <template slot="a_name" slot-scope="scope">
          {{scope.row.owner === scope.row.buy_id ? scope.row.buy_name : scope.row.sell_name}}
          （{{scope.row.owner === scope.row.buy_id ? '买家' : '卖家'}}）
        </template>
        <template slot="b_name" slot-scope="scope">
          {{scope.row.to === scope.row.buy_id ? scope.row.buy_name : scope.row.sell_name}}
          （{{scope.row.to === scope.row.buy_id ? '买家' : '卖家'}}）
        </template>

        <template slot="menu" slot-scope="scope">
          <el-button
            type="text"
            icon="el-icon-check"
            v-if="scope.row.type === 0"
            @click="handleSuccess(scope.row, 1)"
            >通过
          </el-button>
          <el-button
            type="text"
            icon="el-icon-close"
            v-if="scope.row.type === 0"
            @click="handleSuccess(scope.row, 2)"
            >拒绝
          </el-button>
          <el-button
            type="text"
            icon="el-icon-check"
            v-if="scope.row.type === 1"
            >已通过
          </el-button>
          <el-button
            type="text"
            icon="el-icon-close"
            v-if="scope.row.type === 2"
            >已驳回
          </el-button>
          <el-button
            type="text"
            icon="el-icon-help"
            v-if="scope.row.win === 0 && scope.row.type === 1"
            @click="handleUpdate(scope.row)"
            >判定
          </el-button>
          <el-button
            type="text"
            icon="el-icon-help"
            v-if="scope.row.win === 1"
            >买家胜诉
          </el-button>
          <el-button
            type="text"
            icon="el-icon-help"
            v-if="scope.row.win === 2"
            >卖家胜诉
          </el-button>
        </template>
      </avue-crud>
    </basic-container>
    <el-dialog
      title="域名信息"
      :visible.sync="dialogDomain"
      width="50%">
     <avue-form :option="domainOption" v-model="formDomain" > </avue-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogDomain = false">知道了</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { fetchShensuList, putShensuObj } from "@/api/admin/user";
import { fetchDetail } from "@/api/admin/domain";
import { tableOption, domainOption } from "@/const/crud/admin/shensu";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      option: tableOption,
      domainOption: domainOption,
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20, // 每页显示多少条,
        isAsc: false //是否倒序
      },
      list: [],
      listLoading: true,
      dialogDomain: false,
      formDomain: {},
      form: {}
    };
  },
  computed: {
    ...mapGetters(["permissions"])
  },
  created() {
  },
  methods: {
    getList(page, params) {
      this.listLoading = true;
      fetchShensuList(
        Object.assign(
          {
            page: page.currentPage,
            size: page.pageSize
          },
          params
        )
      ).then(response => {
        this.list = response.data.data.data;
        this.page.total = response.data.data.count || '0';
        this.listLoading = false;
      });
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
      this.getList(this.page);
    },
    currentChange(current) {
      this.page.currentPage = current;
      this.getList(this.page);
    },
    handleFilter(param, done) {
      this.page.currentPage = 1;
      this.getList(this.page, param);
      done();
    },
    handleRefreshChange() {
      this.getList(this.page);
    },
    handleOpenBefore(show, type) {
      show();
    },
    getDomain(order) {
      fetchDetail({ order_no: order }).then(res => {
        this.formDomain = res.data.data
        this.dialogDomain = true
      });
    },
    handleUpdate(row, index) {
      this.$refs.crud.rowEdit(row, index);
    },
    handleSuccess(row, status){
      putShensuObj({id: row.id, type: status}).then(() => {
        this.getList(this.page);
        this.$notify.success("操作成功");
      })
      .catch(() => {
        this.$notify.error("操作失败");
      });
    },
    update(row, index, done, loading) {
      putShensuObj({id: row.id, win: row.win})
        .then(() => {
          this.getList(this.page);
          done();
          this.$notify.success("修改成功");
        })
        .catch(() => {
          loading();
        });
    }
  }
};
</script>
<style lang="less">
  .link {
    color: #409EFF;
    cursor: pointer;
  }
</style>
